define(function(require) {

  var $ = require("jquery");
  var _ = require("underscore");
  var Backbone = require("backbone");
  var Utils = require("utils");
  var Parse = require("parse");
        
  var LoginView = Utils.Page.extend({

    constructorName: "LoginView",

    id: "login",

    events: {
      "touchend #loginIoRegalo": "loginIoRegalo",
      "touchend #loginFacebook":"loginFacebook"
    },

    initialize: function(options) {
     
    	//document.addEventListener("deviceready", this.run, false);       
      this.template = Utils.templates.login;
      
    },

    loginIoRegalo: function() {

      Backbone.history.navigate("loginIoRegalo", {
        trigger: true
      });
    
    },


    loginFacebook: function(){

      Backbone.history.navigate("loginFacebook", {
        trigger: true
      });
      
    },

    hideSpinner: function() {
        document.getElementById("spinner").style.display="none";
        document.getElementById("containerMain").style.display="block";
    },

    showSpinner: function() {

        document.getElementById("spinner").style.display="block";
        document.getElementById("containerMain").style.display="none";
        
        var opts = {
            lines: 10, // The number of lines to draw
            length: 20, // The length of each line
            width: 8, // The line thickness
            radius: 15, // The radius of the inner circle
            corners: 1, // Corner roundness (0..1)
            rotate: 0, // The rotation offset
            direction: 1, // 1: clockwise, -1: counterclockwise
            color: '#fff', // #rgb or #rrggbb or array of colors
            speed: 1, // Rounds per second
            trail: 60, // Afterglow percentage
            shadow: false, // Whether to render a shadow
            hwaccel: false, // Whether to use hardware acceleration
            className: 'spinner', // The CSS class to assign to the spinner
            zIndex: 2e9, // The z-index (defaults to 2000000000)
            top: '45%', // Top position relative to parent
            left: '50%' // Left position relative to parent
        };


        var target = document.getElementById('spinner');
        var spinner = new Spinner(opts).spin(target);
    
    },

    render: function() {
      
        $(this.el).html(this.template());
        this.hideSpinner();
        return this;
    },

    rendered: function(e) {
      // if the app is running on an iOS 7 device, then we add the 20px margin for the iOS 7 status bar
      if(device.platform == "iOS" && device.version.startsWith("7.")) {
        document.body.style.marginTop = "20px";
        document.body.style.height = "calc(100% - 20px)";
        document.getElementsByTagName("header")[0].style.marginTop = "20px";
      }
    }


  });

  return LoginView;

});